<template>
  <!-- 资产list   Mention提币-->
  <div>
    <div class="list-box">
      <div class="lump-box coin-box">{{ item.AccountName }}</div>
      <div class="lump-box useable-box">{{ $coin(item.Coin) }}</div>
      <div class="lump-box frost-box">{{ $coin(item.FrostCoin) }}</div>
      <div class="lump-box ttm-box">
      123
        <span class="tinge-text">&nbsp;CNY</span>
      </div>
      <div class="lump-box action-box">
        <router-link to>
          <p class="action-span cursor" @click="transferVisible=true">划转</p>
        </router-link>
        <router-link :to="linkTo">
          <p class="action-span cursor">交易</p>
        </router-link>
      </div>
    </div>
    <!-- 划转的dialog弹窗 -->
    <el-dialog :visible.sync="transferVisible" :lock-scroll="false" top="25vh" width="759px">
      <TransferModule></TransferModule>
    </el-dialog>
  </div>
</template>
<script>
import QRCode from "qrcode";
import TransferModule from "./transfer-list-module";
export default {
  data() {
    return {
      // 划转
      transferVisible: false
    };
  },
  components: {
    TransferModule
  },
  props: ["item"],

  methods: {},

  computed: {
    /*
     *页面前往交易的处理规则，默认前往当前的购买页面
     */
    linkTo() {
      let router = this.item.AccountName.toLocaleLowerCase();
      return "/trade/tiny/by-" + router;
    }
  },

  created() {},

  mounted() {},
  watch: {}
};
</script>
<style scoped>
.list-box {
  width: 100%;
  height: 50px;
  display: flex;
  border-bottom: solid 1px #f0f2f5;
  padding: 0 29px;
}
.list-box:hover {
  background-color: #f7fbfa;
}
.lump-box {
  color: #333333;
  font-size: 12px;
  display: flex;
  align-items: center;
}
.tinge-text {
  color: #999999;
}
.action-span {
  /* width:23px; */
  margin-left: 13px;
  color: #31c0ce;
}
</style>
